<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input id='file' type="file">
    <button>Submit</button>
    <script>
        file.onchange = function(ev){
            console.log(ev.target.files);
            var f = new FormData();
            f.append('file', ev.target.files[0]);
            f.append('a', 'a');
            f.append('a', 'b');
            console.log(f.get('a'));
        }
        var b = document.querySelector('button');
        b.addEventListener('click', debounce(function(ev){
            console.log(ev, this);
        }, 300), false)
        function debounce(fn, delay) {
            var t;
            return function(...args){
                var _this = this;
                clearInterval(t);
                t = setTimeout(() => {
                    fn.call(this, ...args);
                }, delay);
            }
        }
    </script>
</body>
</html>